/**
 * 
 * @authors 前端小灰狼
 * @date    2020-12-10 16:48:28
 * @version v1.0
 * @description the core js of todolist project
 * 
 * ━━━━━━神兽出没━━━━━━
 * 　　   ┏┓　 ┏┓
 * 　┏━━━━┛┻━━━┛┻━━━┓
 * 　┃              ┃
 * 　┃       ━　    ┃
 * 　┃　  ┳┛ 　┗┳   ┃
 * 　┃              ┃
 * 　┃       ┻　    ┃
 * 　┃              ┃
 * 　┗━━━┓      ┏━━━┛ Code is far away from bugs with the animal protecting.
 *       ┃      ┃     神兽保佑,代码无bug。
 *       ┃      ┃
 *       ┃      ┗━━━┓
 *       ┃      　　┣┓
 *       ┃      　　┏┛
 *       ┗━┓┓┏━━┳┓┏━┛
 *     　  ┃┫┫　┃┫┫
 *     　  ┗┻┛　┗┻┛
 *
 * ━━━━━━感觉萌萌哒━━━━━━
 */

// 请根据考试说明文档中列出的需求进行作答
// 预祝各位顺利通过本次考试，see you next week！
// ...


$(function(){
    function add(){
        var data = $("form").children("input").val();
        data.trim();
            var $div=$(`<li>
            <input type="checkbox" />
            <p>${data}</p>
            <a href="javascript:">-</a>
        </li>`);
        $("#todolist").append($div);
        count++;
        $("#todocount").text(count)
    }
    $("form").children("input").keydown(function(event){
        if(event.keyCode == 13) {
            add();
            $("form").children("input").val("")
            event.keyCode = 0;
            event.returnValue = false;
            return false;
        }
    });
    var count = Number($("#todocount").text())
    var counts = Number($("#donecount").text())
    $("#todolist").on("change","input",function(){
        var ck = $(this).prop("checked");
        if(ck){
            $(this).parent().remove();
            $("#donelist").append( $(this).parent());
            counts++;
            $("#donecount").text(counts);
            if(count!==0){
                count--
                $("#todocount").text(count)
            }else{
                count=0
            }
        }
    })
    $("#donelist").on("change","input",function(){
        var ck = $(this).prop("checked");
        if(!ck){
            $(this).parent().remove();
            $("#todolist").append( $(this).parent());
            count++;
            $("#todocount").text(count);
            if(counts!==0){
                counts--
                $("#donecount").text(counts)
            }else{
                counts=0
            }
        }
    })
    $("#todolist").on("click","a",function(){
        $(this).parent().remove()
        if(count!==0){
            count--
            $("#todocount").text(count)
        }else{
            count=0
        }
    })
    
    $("#donelist").on("click","a",function(){
        $(this).parent().remove()
        if(counts!==0){
            counts--
            $("#donecount").text(counts)
        }else{
            counts=0
        }
    })
    $("#todolist").on("click","p",function(){
        var pp = $(this).text();
        var input = $("<input type='text' value = '"+ pp +"'/>")
        $(this).append(input);
        input.click(function(){return false})
        input.trigger("focus");
        input.blur(function(){
            var texts = $(this).val()
            $(this).css({
                border:"none",
            })
            if(texts != pp){
                $(this).parent().html(texts)
                $(this).parent().children().remove()
            }
        })
    })
    $("#donelist").on("click","p",function(){
        var pp = $(this).text();
        var input = $("<input type='text' value = '"+ pp +"'/>")
        $(this).append(input);
        input.click(function(){return false})
        input.trigger("focus");
        input.blur(function(){
            var texts = $(this).val()
            $(this).css({
                border:"none",
            })
            if(texts != pp){
                $(this).parent().html(texts)
                $(this).parent().children().remove()
            }
        })
    })
})

